<script type="text/javascript">
	function SlideCtrl($scope, CtrlUtil, $http, $element, $injector, $q, modalService, UploadService) {
		var ctrl = this;
		ctrl.pageNumber = 0;
		CtrlUtil.build(ctrl, ':root/slide/querySlides')
		// 查詢
		this.dialogPop = function(content, preview, slide, option) {
			var q = $q.defer();
			var method = preview ? 'show' : 'confirm';
			return modalService[method]({
				title : preview ? '预览' : '添加',
				content : content,
				slide : slide
			}, option).then(function(r) {
				q.resolve(slide);
			})
			return q.promise;
		};
		// 添加幻灯
		this.dialogAdd = function() {
			var content = $element.find('.tpl>form').clone();
			var slide = {
				imageUrl : 'asset/img/test.jpg',
				uploadPercent : 0,
				scsj : new Date(),
				status : 1
			};
			var btn = content.find('[file]');
			var config = {
				multipleFiles : false,
				autoUploading : true,
				browser : btn[0],
				maxSize : 1024 * 1024 * 20,
				extFilters : [ ".jpg", ".jpeg", ".png", ".gif", ".bmp" ],
				onComplete : function(file) {
					var attach = {}
					attach.fileName = file.name;
					attach.hash = eval('(' + file.msg + ')').message;
					attach.size = file.size;
					attach.uploading = false
					slide.fjId = (attach.hash + '/' + attach.size)
					slide.imageUrl = UploadService.getServerUrl() + '/preview/getImage?w=400&h=300&hash=' + attach.hash + '&size='
							+ attach.size
					$scope.$$phase || $scope.$apply()
				},
				onSelect : function(list) {
					var notImage = false, overSize = false
					angular.forEach(list, function(v) {
						if (v.size > (1024 * 1024 * 20)) {
							overSize = true
						}
					})
					if (overSize) {
						toaster.pop({
							type : 'error',
							body : '文件大小不能超过20M',
							timeout : 800
						});
						$scope.$$phase || $scope.$apply()
					}
				}
			};
			var stream = UploadService.create(config);
			ctrl.dialogPop(content, false, slide, {
				backdrop : false
			}).then(function(r) {
				$http.post(':root/slide/addSlide', slide).success(function(r) {
					if (r) {
						$injector.get('modalService').succ('添加成功。', 1500);
						ctrl.current = r;
						ctrl.query();
					}
				});
			});
		};
		// 预览
		this.dialogPreview = function(slide) {
			var imageUrl = slide.fjId ? (UploadService.getServerUrl() + '/preview/getImage?w=400&h=300&hash=' + slide.fjId.split('/')[0]
					+ '&size=' + slide.fjId.split('/')[1]) : 'asset/img/test.jpg';
			var content = $element.find('.tpl2>div').clone();
			var slide = {
				imageUrl : imageUrl
			};
			ctrl.dialogPop(content, true, slide);
		};
		// 删除
		this.remove = function(id) {
			var ids = [];
			if (id) {
				ids.push(id);
			} else {
				var checked = CtrlUtil.getChecked(ctrl);
				if (checked.length == 0) {
					return;
				}
				angular.forEach(checked, function(v) {
					ids.push(v.id);
				});
			}
			return modalService.confirm({
				title : '删除',
				content : '确定要<label class="text-danger">删除</label>选中的' + ids.length + '条数据吗?'
			}).then(function(r) {
				$http.post(':root/slide/deleteSlide', {
					ids : ids
				}).success(function(r) {
					modalService.succ('删除成功。', 1500);
					ctrl.query();
				});
			});
		};
		this.enable = function(id, e) {
			var msg = (e ? '启用' : '停用');
			return modalService.confirm({
				title : msg,
				content : '确定要' + msg + '吗？'
			}).then(function(r) {
				$http.post(':root/slide/enableSlide', {
					id : id,
					enable : e
				}).success(function(r) {
					modalService.succ(msg + '成功。', 1500);
					ctrl.query();
				});
			});
		};
		this.checkAll = function(b) {
			CtrlUtil.checkAll(ctrl, b)
		};
	}
</script>
<!-- Search area -->
<div ng-controller="SlideCtrl as ctrl" ng-init="ctrl.query()">
	<!-- Search area -->
	<div class="panel panel-cys">
		<div class="panel-heading">
			<h3 class="panel-title">
				<span class="glyphicon glyphicon-search"></span>
				信息查询
			</h3>
		</div>
		<div class="panel-body">
			<form class="form-horizontal">
				<div class="form-group">
					<div class="col-md-2"></div>
					<div class="col-md-8">
						<div class="input-group">
							<input type="text" class="form-control" placeholder="输入幻灯片名称模糊查询" ng-model="ctrl.nameQueryParam">
							<span class="input-group-btn">
								<button type="submit" class="btn btn-cys" ng-click="ctrl.query()">
									<span class="glyphicon glyphicon-search"></span>
									查询
								</button>
							</span>
						</div>
					</div>
					<div class="col-md-2"></div>
				</div>
			</form>
		</div>
	</div>
	<!-- Search area END -->

	<!-- operation area -->
	<button type="button" class="btn btn-cys btn-sm" ng-click="ctrl.dialogAdd()">
		<span class="glyphicon glyphicon-plus"></span>
		新增
	</button>
	<button type="button" class="btn btn-danger btn-sm" ng-click="ctrl.remove()">
		<span class="glyphicon glyphicon-minus"></span>
		删除
	</button>
	<div class="ny-top-r pull-right" ng-include="':root/components/page.html'"></div>
	<!-- operation area END -->


	<!-- data grid area -->
	<div style="padding-top: 10px;">
		<table class="table table-bordered table-hover table-striped">
			<tr>
				<th>
					<input ng-change="ctrl.checkAll(ctrl.$checkAll)" ng-model="ctrl.$checkAll" type="checkbox" />
				</th>
				<th>幻灯片名称</th>
				<th>上传时间</th>
				<th>是否启用</th>
				<th>操作</th>
			</tr>
			<tr ng-repeat="item in ctrl.entities.content">
				<td><input ng-model="item.$checked" type="checkbox" /></td>
				<td>{{item.name}}</td>
				<td title="{{item.scsj|date:'yyyy-MM-dd HH:mm'}}">{{item.scsj|date:'yyyy-MM-dd HH:mm'}}</td>
				<td class="{{item.status==0?'text-danger':'text-success'}}">{{item.status==0?'禁用':'启用'}}</td>
				<td><a href="javascript:;" ng-click="ctrl.dialogPreview(item)">预览</a> <a ng-show="item.status==1" href="javascript:;"
						class="remove-underline" ng-click="ctrl.enable(item.id, false)">停用</a> <a ng-show="item.status==0" href="javascript:;"
						class="remove-underline" ng-click="ctrl.enable(item.id, true)">启用</a> <a href="javascript:;" ng-click="ctrl.remove(item.id)">刪除</a></td>
			</tr>
		</table>
		<p>
			共有记录：
			<span>{{ctrl.entities.totalElements}}</span>
			条
		</p>
	</div>
	<!-- data grid area END -->

	<!-- 幻灯片新增、编辑弹出框 -->
	<div ng-non-bindable class="tpl hidden">
		<form>
			<div class="form-group">
				<label>幻灯片名称</label>
				<input type="text" class="form-control" ng-model="slide.name" required="required">
			</div>
			<div class="form-group">
				<label>启用状态</label>
				<select class="form-control" ng-model="slide.status">
					<option value="1">启用</option>
					<option value="0">停用</option>
				</select>
			</div>
			<div class="form-group">
				<label for="exampleInputFile">上传幻灯片</label>
				<p class="help-block">【提醒】： 必须要上传哦，上传格式仅为图片常见格式，建议尺寸1150*300，且大小不要超过10M。</p>
				<div class="btn thumbnail" file title="点击更换图片">
					<img class="img-responsive" style="max-height: 160px;" ng-src="{{slide.imageUrl}}" alt="...">
				</div>
			</div>
		</form>
	</div>
	<!-- 幻灯片新增、编辑弹出框 END -->

	<!-- 幻灯片预览弹出框 -->
	<div ng-non-bindable class="tpl2 hidden">
		<div class="text-center">
			<img ng-src="{{slide.imageUrl}}" class="img-thumbnail">
		</div>
	</div>
	<!-- 幻灯片预览弹出框 END -->
</div>